import { FC } from "react";
import { IconFont } from "../../../utils/iconfont/icon";
import styles from "./home.module.css";
import { useDispatch } from "react-redux";
import { BrowserRouter, Route, Switch, useHistory } from "react-router-dom";
// import { Input } from "antd";
// import { SearchOutlined } from "@ant-design/icons";
import Header from "../../../components/Header";
import Frined from "../../friend";
import FountMusic from "../../fountMusic";
import User from "../../user";
import List from "../../../components/list";
import PlayerComponent from "../../../components/playerComponent";
import { Menu } from "antd";
import {
  AppstoreOutlined,
  MailOutlined,
  SettingOutlined,
} from "@ant-design/icons";
const { SubMenu } = Menu;
const Home: FC = () => {
  const history = useHistory();
  //   const dispatch = useDispatch();
  //   const goLogin = () => {};
  //   const userData = useSelector((s) => s.user);
  const handleClick = (e) => {
    console.log("click ", e);
  };
  const go1 = () => {
    history.push("/home/friend");
  };
  const go2 = () => {
    history.push("/home/foundmusic");
  };
  return (
    <div className={styles.page}>
      <Header />
      <div className={styles.pageLeft}>
        <div className={styles.title}>
          <Menu
            onClick={handleClick}
            style={{ width: 256 }}
            defaultSelectedKeys={["1"]}
            defaultOpenKeys={["sub1"]}
            mode="inline"
          >
            <Menu.Item key="1" onClick={go1}>
              发现音乐
            </Menu.Item>
            <Menu.Item key="2" onClick={go2}>
              播客
            </Menu.Item>
            <Menu.Item key="3" onClick={go1}>
              视频
            </Menu.Item>
            <Menu.Item key="4" onClick={go1}>
              朋友
            </Menu.Item>
            <Menu.Item key="5" onClick={go1}>
              直播
            </Menu.Item>
            <Menu.Item key="6" onClick={go1}>
              私人FM
            </Menu.Item>
            <Menu.ItemGroup key="g1" title="我的音乐">
              <Menu.Item key="7">本地与下载</Menu.Item>
              <Menu.Item key="8">最近播放</Menu.Item>
              <Menu.Item key="9">我的音乐云盘</Menu.Item>
              <Menu.Item key="10">我的播客</Menu.Item>
              <Menu.Item key="11">我的收藏</Menu.Item>
            </Menu.ItemGroup>

            <SubMenu key="sub" title="创建的歌单">
              {/* <Menu.Item key="sub1">Option 7</Menu.Item> */}
            </SubMenu>
            <SubMenu key="shoucang" title="收藏的歌单">
              <Menu.Item key="shoucang1">Option 7</Menu.Item>
            </SubMenu>
          </Menu>
        </div>
        <div className={styles.content}>
          <Switch>
            <Route exact path="/home/friend" component={Frined} />
            <Route path="/home/foundmusic" component={FountMusic} />
            <Route path="/home/user" component={User} />
            <Route path="/home/listDetail" component={List} />
          </Switch>
        </div>
      </div>
      <PlayerComponent />
    </div>
  );
};

export default Home;
